<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>管理端查看</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">

    <link rel="stylesheet" href="/static/layui/css/layui.css" media="all">
    <!--<link rel="stylesheet" href="/static/css/public.css">-->
    <script type="application/javascript" src="/static/js/jQuery.js"></script>
    <script type="application/javascript" src="/static/layui/layui.js"></script>
    <style>
        .formBody{
            padding: 0px auto;
        }

        .formContext{
            border: #009688;
            border: 1px;
            width: 80%;
            margin: 10px auto;
        }

    </style>
</head>
<body>

    <div class="formBody">
        <div class="formContext">
            <div class="layui-col-md12">
                <div class="layui-card">
                    <div class="layui-card-header">任务详情</div>
                    <div class="layui-card-body">
                        <table class="layui-table" lay-even lay-skin="nob" lay-size="lg">
                            <colgroup>
                                <col width="150">
                                <col width="200">
                                <col>
                            </colgroup>
                            <tbody>
                            <tr>
                                <td>姓名</td>
                                <td th:text="${work.userName}"></td>
                                <td>当前状态</td>
                                <td>
                                    <span th:if="${work.done == true}" class="layui-badge layui-bg-blue">已完成</span>
                                    <span th:if="${work.done == false}" class="layui-badge layui-bg-orange">未完成</span>
                                </td>
                            </tr>
                            <tr>
                                <td width="25%">计划时间</td>
                                <td width="25%" th:text="${#dates.format(work.planTime, 'yyyy-MM-dd HH:mm')}"></td>
                                <td width="25%">计划完成</td>
                                <td width="25%" th:text="${#dates.format(work.doneTime, 'yyyy-MM-dd HH:mm')}"></td>
                            </tr>
                            <tr>
                                <td>计划事项</td>
                                <td colspan="3" th:text="${work.plan}"></td>
                            </tr>
                            <tr>
                                <td>实际情况</td>
                                <td colspan="3" th:text="${work.context}"></td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                </div>

                <div class="layui-form-item" style="text-align: center">
                    <input type="hidden" id="workingId" th:value="${work.id}">
                    <button class="layui-btn layui-btn-radius" lay-filter="hadDone" id="hadDone">已完成</button>
                    <button class="layui-btn layui-btn-radius layui-btn-danger" lay-filter="notDone" id="notDone">未完成</button>
                </div>
            </div>
        </div>
    </div>

<script type="application/javascript" >
    layui.use('layer', function(){
        var $ = layui.jquery, layer = layui.layer;
        $(document).on('click','#hadDone',function(){
            checkDone(true);
        });
        $(document).on('click','#notDone',function(){
            checkDone(false);
        });
    });

    function checkDone(r){
        var workId = $("#workingId").val();
        $.get("/adminRest/check",{id:workId, done:r},function(data){
            layer.msg(data.msg);
        });
    }

</script>
</body>
</html>